<template>
  <view class="card">
    <uni-forms :modelValue="formData" label-width="75px">
      <uni-forms-item label="店铺名称:" name="name">
        <uni-easyinput type="text" v-model="formData.name" placeholder="请输入" :clearable="false" />
      </uni-forms-item>
      <uni-forms-item label="店铺地址:" name="name" :show-extra-icon="true" :extra-icon="{type: 'spinner'}">
        <view style="display: flex; align-items: center;">
          <uni-easyinput type="textarea" autoHeight v-model="formData.address" placeholder="如果定位无效请手动输入" :clearable="false" />
          <uni-icons @click="onGetAddress" type="location" size="30"></uni-icons>
        </view>
      </uni-forms-item>
      <uni-forms-item label="理发价格:" name="name">
        <uni-easyinput type="text" v-model="formData.price" placeholder="请输入" :clearable="false" />
      </uni-forms-item>
      <uni-forms-item label="店铺状态:" name="name" class="last-item">
        <view style="margin-top: 9px;">基础版，已激活</view>
      </uni-forms-item>
    </uni-forms>
    <!-- #ifdef APP-HARMONY -->
    <button @click="onSave" type="primary">保存</button>
    <!-- #endif -->
  </view>

</template>

<script>
  import { saveDpInfo, getDpInfo } from '../../utils/storage.js'
  export default {
    onNavigationBarButtonTap(btn) {
      this.onSave()
    },
    onLoad() {
      /* const data = getDpInfo()
      this.formData = data */
    },
    data() {
      return {
        formData: {}
      }
    },
    methods: {
      onSave() {
        saveDpInfo(this.formData)
        uni.showToast({
          title: '数据存储成功！'
        })
      },
      onGetAddress() {
        uni.chooseLocation({
        	success: (res) => {
        		this.formData.address = res.address
        	}
        })
      }
    }
  }
</script>

<style scoped>
  page {
    background-color: #f1f3f5;
    padding: 10px;
  }
  :deep(.last-item) {
    /* #ifndef APP-HARMONY */
    margin-bottom: 0;
    /* #endif */
  }
</style>